<template>
  <!--复核记录 -->
  <a-modal title="复核记录" :visible="visible" width="1200px" @cancel="handleCancel">
    <a-table bordered rowKey="fileId" :columns="columns" :data-source="tabaleData" :pagination="false" :loading="loading">
      <template slot="fileInfos" slot-scope="text, record">
        <UploadList multiple :uploadArrys="text || []" :isShow="false" disabled class="nodeReviewRecordUpload" /> 
      </template>
    </a-table>
    <!-- 页脚操作栏 -->
    <div slot="footer">
      <a-button @click="handleCancel">关闭</a-button>
    </div>
  </a-modal>
</template>
<script>
import UploadList from '@/components/UploadList'
import monthPlanApi from '@/api/construction/monthPlanApi'
export default {
  name: 'nodeReviewRecord',
  props: {
    // 显示隐藏
    visible: {
      type: Boolean,
      default: false
    },
    // 节点ID
    nodeId: {
      type: String,
      default: ''
    }
  },
  components: {
    UploadList
  },
  watch: {
    visible: {
      handler(val) {
        if (val) {
          this.getList()
        }
      },
    }
  },
  data() {
    return {
      loading: false,
      tabaleData: [],
      columns: [
        {
          title: '序号',
          width: 70,
          key: 'index',
          customRender: (text, record, index) => `${index + 1}`
        },

        {
          title: '复核结果',
          dataIndex: 'statusName',
          width: 150
        },
        {
          title: '复核情况说明',
          dataIndex: 'reviewSituation',
          width: 400
        },
        {
          title: '复核时间',
          dataIndex: 'reviewDate',
          width: 150
        },
        {
          title: '复核人',
          dataIndex: 'reviewEmployeeName',
          width: 150
        },
        {
          title: '附件',
          dataIndex: 'fileInfos',
          scopedSlots: { customRender: 'fileInfos' },
        }
      ]
    }
  },
  methods: {
    getList() {
      this.loading = true
      monthPlanApi.queryReviews({nodeId: this.nodeId}).then(res => {
        if (res.data) {
          this.tabaleData = res.data
        }
      }).finally(() => {
        this.loading = false
      })
    },
    handleCancel() {
      this.$emit('update:visible', false)
    }
  }
}
</script>
  <style lang="less" scoped>
  @deep: ~'>>>';
.nodeReviewRecordUpload {
  @{deep} .ant-btn{
    padding: 0;
    span{
      display: inline-block;
      text-align: left;
      white-space: normal;
    }
  }
}
</style>